
/****************************** reset ******************************/
  html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video{
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 100%;
      font: inherit;
      vertical-align: baseline;
  }
  /* HTML5 display-role reset for older browsers */
  *{
    box-sizing: border-box;
  }
  article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
  }
  body {
    line-height: 1;
  }
  ol, ul {
    list-style: none;
  }
  blockquote, q {
    quotes: none;
  }
  blockquote:before,
  blockquote:after,
  q:before,
  q:after {
    content: '';
    content: none;
  }
  table {
    border-collapse: collapse;
    border-spacing: 0;
  }
  /*user define reset*/
  html, body {
    position: relative;
    width: 100%;
    height: 100%;
    font-size: 16px;
    line-height: 1.5;
    font-family: "Helvetica Neue", helvetica, 'lucida grande', 'lucida sans unicode', lucida, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
  }
  a, a:hover, a:focus {
    color: #000;
    text-decoration: none;
  }
  img {
    display: inline-block;
    max-width: 100%;
    max-height: 100%;
  }
  /*clear float*/
  .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
  }
  ::-webkit-scrollbar {
    background: transparent;
    overflow: visible;
    width: 8px;
    border-radius: 8px;
  }
  ::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border: solid #fff;
  }
  ::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.8);
  }
  ::-webkit-scrollbar-thumb:horizontal {
    border-width: 6px 8px;
    min-width: 40px;
  }
  ::-webkit-scrollbar-thumb:vertical {
    border-width: 4px 2px;
    min-height: 40px;
  }
  ::-webkit-scrollbar-track-piece {
    background-color: #fff;
  }
  ::-webkit-scrollbar-corner {
    background: transparent;
  }
  ::-webkit-scrollbar-thumb {
    background-color: #ADADAD;
    -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1), inset 0 -1px 0 rgba(0, 0, 0, 0.07);
  }
  ::-webkit-scrollbar-thumb:hover {
    background-color: #999;
  }
  input, button, select, textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    outline: none;
  }
  textarea {
    resize:none;
    min-height: 64px;
    height: auto;
  }
/**/

/****************************** 右侧部分-主体 ******************************/
  .m_wrapper {
    width: 100%;
    height: 100%;
    background-color: #fff;
    position: relative;
  }
  .m_wrapper .u_wrapper {
    position: relative;
    margin-left: 70px;
    height: 100%;
    overflow: hidden; /*me:  hidden  -> none*/
    /*&.u_left_300x{
              margin-left: @menu-full-width;
          }*/
  }
  /*右侧区域头部*/
  .m_wrapper .u_wrapper .u_header {
    margin: 0 35px;
    width: calc(100% - 140px);
    min-width: 1100px - 140px;
    height: 60px;
    line-height: 60px;
    background-color: #fff;
    border-bottom: 2px solid #fff;
    overflow: hidden;
    text-align: center;
    position:fixed;
    z-index:999;
  }
  .m_wrapper .u_wrapper .u_header > h2 {
    font-size: 21px;
    color: #000;
  }
  /*右侧区域内容*/
  .m_wrapper .u_wrapper .u_content_wrapper {
    margin: 10px;
    padding: 0px 25px 20px;
    height: calc( 100% - 80px);
    min-width: 678px;
    background-color: #fff;
    overflow-x: hidden;
    overflow-y: auto;
    height:100%;
  }
/**/

/****************************** 工具栏 ******************************/
  .u_toolbar {
    /*margin-left: @content-margin-left;*/
    position: fixed;
    width: calc(100% - 140px);
    min-width: 1100px - 140px;
    padding: 15px 0px;
    border-bottom: 1px solid #ddd;
    background-color: #fff;
    z-index: 99;
    top: 60px;
  }
  .u_toolbar .u_toolgroup,
  .u_toolbar .u_tool {
    display: inline-block;
  }
  .u_toolbar .u_toolgroup {
    margin-right: 50px;
  }
  @media screen and (max-width: 960px) {
    .u_toolbar .u_toolgroup {
      margin-right: 15px;
    }
  }
  @media screen and (max-width: 768px) {
    .u_toolbar .u_toolgroup {
      margin-right: 15px;
    }
  }
  .u_toolbar .u_toolgroup .u_tool {
    cursor: pointer;
  }
  .u_toolbar .u_toolgroup .u_tool:not(:first-child) {
    margin-left: 20px;
  }
  .u_toolbar .u_toolgroup .u_tool:hover {
    color: #15afce;
  }
  .u_toolbar .u_toolgroup .u_tool:hover i {
    border-color: #15afce;
  }
  @media screen and (max-width: 960px) {
    .u_toolbar .u_toolgroup .u_tool span {
      display: none;
    }
  }
  .u_toolbar .u_toolgroup .u_tool i,
  .u_modal_header .u_toolgroup .u_tool i  {
    width: 25px;
    height: 25px;
    margin-right: 2px;
    border: 1px solid #92908d;
    border-radius: 100%;
    text-align: center;
    vertical-align: middle;
    line-height: 25px;
    font-weight: 400;
    font-size: 14px;
  }
  .u_toolbar .u_toolgroup .u_tool i:hover,
  .u_toolbar .u_toolgroup .u_tool i:focus {
    border-color: #15afce;
  }
  @media screen and (max-width: 960px) {
    .u_toolbar .u_toolgroup .u_tool i {
      margin-right: 0px;
    }
  }
  .u_toolbar .u_toolgroup.u_search,
  .u_modal_header .u_toolgroup.u_search {
    position: relative;
    /*margin-left: 2* @xlg-2x-marign;*/
    color: #92908d;
    font-size: 14px;
  }
  .u_toolbar .u_toolgroup.u_search .u_tool:hover,
  .u_modal_header .u_toolgroup.u_search .u_tool:hover {
    color: #92908d;
  }
  .u_toolbar .u_toolgroup.u_search i,
  .u_modal_header .u_toolgroup.u_search i {
    position: absolute;
    top: 3px;
    right: 8px;
    border: none;
  }
  .u_toolbar .u_toolgroup.u_search i:hover,
  .u_modal_header .u_toolgroup.u_search i:hover {
    background-color: #ddd;
    color: #fff;
  }
  .u_toolbar .u_toolgroup.u_search input,
  .u_modal_header .u_toolgroup.u_search input {
    padding: 2px 15px;
    outline: none;
    height: 30px;
    line-height: 30px;
    border-radius: 30px;
    border: 1px solid #ddd;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  .u_toolbar .u_toolgroup.u_search input:focus,
  .u_modal_header .u_toolgroup.u_search input:focus {
    border-color: #15afce;
  }
/**/

/****************************** search_tool ******************************/
  .search_tool_outer {
    position: absolute;
  }
  .search_tool_conter {
    font-size: 14px;
    color: #666;
    /*margin: 0 0 0 121px;*/
    height: 25px;
    width: 538px;
    line-height: 25px;
  }
  .search_tool_conter span {
    margin-right: 25px;
    cursor: pointer;
    color: #666;
  }
/**/

/****************************** u_cover ******************************/
  .u_content_wrapper .u_cover{
    position: fixed;
    top: 101px;
    background: #fff;
    border-top: 0;
    border-bottom: 1px solid #ddd;
    z-index: 99;
    width: calc(100% - 140px);
    min-width: 628px;
    height: 39px;
  }
/**/

/****************************** 主体内容 ******************************/
  .u_contents {
    margin-top: 150px;
  }
  .u_contents .u_fixed_row {
    width: 400px;
    position: absolute; 
    /*border: 1px solid #ddd;*/
    top: 150px;
    bottom: 0;
    overflow-y: scroll;
    overflow-x: hidden;
  }
  /*** 栅格布局 ***/
    .u_row {
      display: flex;
      -ms-flex-direction: row;
      -webkit-flex-direction: row;
      flex-direction: row;
      -ms-flex-wrap: wrap;
      -webkit-flex-wrap: wrap;
      flex-wrap: wrap;
      align-items: stretch;
      justify-content: space-between;
    }
    .u_row .u_col_2x {
      width: 16.666666%;
    }
    .u_row .u_col_3x {
      width: 25%;
    }
    .u_row .u_col_4x {
      width: 33.333333%;
    }
    .u_row .u_col_6x {
      width: 50%;
    }
    .u_row .u_col_8x {
      width: 66.666666%;
    }
    .u_row .u_col_10x {
      width: 83.333333%;
    }
    .u_row .u_col_12x {
      width: 100%;
    }
  /**/

  /* u_block_content */
    .u_block_content {
      /*margin-right: 100px;*/
    }

    /* 表单内容区域盒子 */
    .form-control[disabled]{
      background-color: #f5f5f5;
      opacity: 0.8;
      cursor: default;
    }

    .u_block .u_title {
      padding: 15px 0;
    }

    .u_content_wrapper .u_tabs {
      position: relative;
      margin-top: 10px;
      padding: 10px 0px;
      border-bottom: 1px solid #ddd;
      line-height: 1.1;
    }
    .u_content_wrapper .u_tabs .u_tab {
      float: left;
      position: relative;
      cursor: pointer;
      padding: 0px 10px;
    }
    .u_content_wrapper .u_tabs .u_tab:not(:first-child) {
      margin-left: 25px;
    }
    .u_content_wrapper .u_tabs .u_tab:after {
      content: "";
      position: absolute;
      top: 27px;
      left: 0;
      display: block;
      width: 0;
      height: 0;
      border-top: 2px solid #15afce;
      -moz-transition: width 0.2s ease-in;
      -o-transition: width 0.2s ease-in;
      -webkit-transition: width 0.2s ease-in;
      transition: width 0.2s ease-in;
    }
    .u_content_wrapper .u_tabs .u_tab:hover {
      color: #15afce;
    }
    .u_content_wrapper .u_tabs .u_tab.u_tab_active:after,
    .u_content_wrapper .u_tabs .u_tab:hover:after {
      width: 100%;
    }
    .u_content_wrapper .u_tabs .u_tab.u_tab_active {
      color: #15afce;
    }
    .u_content_wrapper .u_panes {
      border-left: 1px solid #ddd;
      border-right: 1px solid #ddd;
      border-bottom: 1px solid #ddd;
      padding: 15px;
    }
    .u_content_wrapper .u_panes .u_pane {
      display: none;
      -moz-transition: all 0.5s ease-in;
      -o-transition: all 0.5s ease-in;
      -webkit-transition: all 0.5s ease-in;
      transition: all 0.5s ease-in;
    }
    .u_content_wrapper .u_panes .u_pane.u_pane_active {
      display: block;
    }
  /**/
  /* 界面上的u_pictures */
    .u_pictures .u_item,
    .u_pictures .u_add_item {
      position: relative;
      float: left;
      width: 150px;
      height: 150px;
      border: 1px solid #ddd;
      margin: 0px 15px 15px 0px;
      background: url(../asset/images/img_add_placeholder.png) no-repeat center center;
      cursor: pointer;
    }
    .u_pictures .u_item:after {
      content: "主 图";
    }
    li[data-tab="detailPC"] .u_pictures .u_add_item:last-child:after,
    li[data-tab="detailMob"] .u_pictures .u_add_item:last-child:after {
      content: "添 加";
    }
    li[data-tab="detailPC"] .u_pictures .u_add_item:last-child:after,
    li[data-tab="detailMob"] .u_pictures .u_add_item:last-child:after,
    .u_pictures .u_item:after {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      background-color: #15afce;
      font-size: 20px;
      color: #fff;
      text-align: center;
      line-height: 40px;
    }
    li[data-tab="detailPC"] .u_pictures .u_add_item:last-child:before,
    li[data-tab="detailMob"] .u_pictures .u_add_item:last-child:before {
      content: "最多添加五张";
      position: absolute;
      left: 0;
      top: 0;
      font-size: 16px;
      width: 100%;
      text-align: center;
      color: #dfdfdf;
      line-height: 60px;
    }
    .u_pictures .u_item a,
    .u_pictures .u_add_item a,
    .u_pictures .u_item img,
    .u_pictures .u_add_item img {
      display: block;
      width: 150px;
      height: 150px;
    }
  /**/

  /* u_m_body */
    .u_m_body .u_pictures .u_checked:before{
      content: "\f046";
      position: absolute;
      top: 5px;
      left: 5px;
      width: 20px;
      height: 20px;
      font-size: 25px;
      font-family: 'FontAwesome';
      color: #15afce;
    }

    .u_m_body .u_fixed_row {
      position: fixed;
      left: 100px;
      top: 150px;
    }
    .u_m_body .u_row {
      margin-left: 520px;
      margin-right: 100px;
      padding: 15px;
      border: 1px solid #ddd;
    }
    /* 关闭按钮 */
    .u_pictures .u_add_item .u_close {
      line-height:20px;
      content: "\f00d";
      position: absolute;
      top: 5px;
      right: 5px;
      width: 20px;
      height: 20px;
      font-size: 25px;
      font-family: 'FontAwesome';
      color: #15afce;
    }
    .u_pictures .u_add_item .u_close:hover {
      font-size: 29px;
      cursor: pointer;
    }
    .u_pictures .u_add_item .u_desc {
      position: absolute;
      padding: 5px;
      width: 100%;
      height: 40px;
      line-height: 1.2;
      left: 0;
      bottom: 0;
      color: #fff;
      font-size: 12px;
      word-break: break-all;
      background-color: rgba(0, 0, 0, 0.7);
      -moz-transition: all 0.6s ease;
      -o-transition: all 0.6s ease;
      -webkit-transition: all 0.6s ease;
      transition: all 0.6s ease;
    }
  /**/

  /* u_footer按钮 */
    .u_footer {
      margin-top: 25px;
      padding: 15px;
    }
    .u_footer .u_btn {
      width: 100px;
    }
    .u_footer .u_btn i {
      margin-right: 10px;
    }
    .btn {
        outline: 0;
        border-radius: 2px;
        -webkit-transition: 0.25s linear;
        transition: 0.25s linear;
        font-weight: 400;
        -webkit-font-smoothing: antialiased;
    }
    .btn-success,
    .btn-success:hover,
    .btn-success:focus {
        color: #fff;
        background-color: #2dcb73;
        border-color: #2dcb73;
    }
  /**/

  /*富文本框*/
    li[data-tab="detailPC"] .u_block_content>:first-child,
    li[data-tab="detailMob"] .u_block_content>:first-child,
    .u_field_text {
        width: 100% !important;
        z-index: 9 !important;
    }
  /**/

/**/

/****************************** 自定义表单 ******************************/
  .form-horizontal .data-label {
      width: 160px;
      // float: left;
      text-align: left;
      // padding: 5px 0 5px 20px;
  }
  .form-horizontal .data-input {
      width: 50%;
  }
  .input-group-addon {
    cursor: pointer;
  }
  /* 模态框上的自定义表单 */
  .u_modal_body .form-horizontal {
      margin-top: 15px;
  }
  .u_modal_body .form-horizontal .data-label {
      width: 80px;
      float: left;
      text-align: left;
      padding: 5px 0 5px 20px;
  }
  .u_modal_body .form-horizontal .data-input {
      width: calc(100% - 105px);
      margin-left: 80px;
  }
/**/

/****************************** 自定义模态框 ******************************/
  .modal-overlay {
    /*visibility: hidden;*/
    position: fixed;   /* 使用绝对定位或固定定位  */
    left: 0px;    
    top: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
    z-index: 999;
    background-color: rgba(51,51,51,.8);
    overflow-x: hidden;
    overflow-y: auto;
  }
  .modal-overlay .modal-minus {
    min-width: 80px !important;
    width: 80px !important;
    height: 80px;
    border-radius: 100%;
    margin: 80px;  
    position: relative;
  }
  .modal-overlay .modal-minus.modal-data {
    overflow: hidden;
  }
  .modal-overlay .modal-minus .u_restore {
    display: block;
    width: 80px;
    height: 80px;
    line-height: 80px;
    margin-top: -25px;
    margin-left: -15px;
    border-radius: 100%;
    cursor: pointer;
  }
  .modal-overlay .modal-minus .u_restore:before {
    content: "\f2d2";
    font-size: 36px;
    font-family: 'FontAwesome';
    color: #92908d;
  }
  /* 模态框样式 */
  .modal-data{
    position: relative;
    overflow-x: hidden;
    overflow-y: scroll;
    margin: 80px auto;
    background-color: #fff;
    border: 1px solid #000;
    padding: 25px 15px 15px;
    text-align: center;
  }
  .modal-data .u_modal_header {
    height: 40px;
    line-height: 40px;
    border-bottom: 1px solid #ddd;
  }
  .u_modal_header .u_title {
    color: #92908d;
  }
  .u_modal_header .u_title i {
    width: 25px;
    height: 25px;
    margin-right: 2px;
    /* border: 1px solid #92908d; */
    border-radius: 100%;
    text-align: center;
    vertical-align: middle;
    line-height: 25px;
    font-weight: 400;
    font-size: 14px;
    cursor: pointer;
  }
  .u_modal_header .u_title i:hover {
    background-color: #ddd;
    color: #fff;
  }
  .u_modal_header .u_title.u_close i:hover {
    background-color: #DB4437;
  }
  .u_modal_header .u_toolgroup.u_search i {
    top: 8px;
    cursor: pointer;
  }
  .u_modal_body {
    padding: 15px 0;
  }
  .u_modal_body .u_contents {
    margin-top: 0;
  }
  .u_modal_body .u_add_item {
    zoom: 0.8;
  }
  .u_modal_body .u_pictures .u_checked:before{
    content: "\f046";
    position: absolute;
    top: 5px;
    left: 5px;
    width: 20px;
    height: 20px;
    font-size: 25px;
    font-family: 'FontAwesome';
    color: #15afce;
  }
  .u_modal_body .u_footer {
    margin-top: 0;
  }
  .u_modal_body .u_footer .record-group {
    float: left;
    line-height: 34px;
    margin-right: 20px;
  }
  .modal-data .u_row {
    margin-left: 420px;
  }

/**/

/****************************** 自定义提示框 ******************************/
  .myAlert {
    position: fixed;
    top: 50%;
    left: 50%;
    /*height: 80px;
    width: 180px;*/
    min-width: 120px;
    border-radius: 2px;
    background: rgba(0,0,0,.8);
    z-index: 999;
    text-align: center;
    color: #ddd;
    box-sizing:border-box;
    padding: 25px 50px;
  }
  @keyframes fade-out {  
      0% {opacity: 1;}
      30% {opacity: 1;}    
      100% {opacity: 0;}
  }  
  @-webkit-keyframes fade-out {/*针对webkit内核*/  
      0% {opacity: 1;}  
      30% {opacity: 1;}   
      100% {opacity: 0;}  
  }  
  .myAlert {    
      animation: fade-out;/*动画名称*/  
      animation-duration: 3s;/*动画持续时间*/  
      -webkit-animation: fade-out 3s;/*针对webkit内核*/  
  }  
/**/

/****************************** 蓝色小标题 ******************************/
  .u_block_title {
      display: inline-block;
      margin-top: 10px;
      padding: 10px 0px;
      position: relative;
      cursor: default;
  }
  .u_block_title h2 {
      width: 100px;
      text-align: center;
      padding: 0px 10px;
      color: #15afce;
  }
  .u_block_title h2:after {
      content: '';
      position: absolute;
      left: 0;
      top: 45px;
      display: block;
      width: 100px;
      border-top: 2px solid #15afce;
  }
/**/

/****************************** jqGrid ******************************/
  thead tr.ui-jqgrid-labels th,
  tbody tr.jqgrow td {
    vertical-align: middle;
  }
  /*thead tr.ui-jqgrid-labels th.ui-th-column div{
    white-space: normal !important;
    height: auto !important;
    padding: 0px;
  }*/
  .ui-jqgrid {
    background: rgba(245,245,245,.2);
  }
  .ui-jqgrid .ui-jqgrid-bdiv {
    overflow-x: hidden;
  }
  td[dir="ltr"] select {
    min-width: 40px;
  }
/**/

/****************************** jsTree工具栏 ******************************/
  .t_toolbar {
    width: 120px;
    position: fixed;
    top: 150px;
    left: 375px;
    margin-top: 4px;
    border: 1px solid #ddd;
    padding: 5px;
    background: #fff;
  }
  .t_toolgroup.t_search input{
    width: 108px;
    padding: 3px 8px;
    border-radius: 2px;
    border: 1px solid #ddd;
    box-shadow: inset 0 0 4px #ddd;
    color: #92908d;
  }
  .t_toolgroup.t_search input:focus {
      border-color: #15afce;
  }
  .t_toolgroup .t_tool {
      height: 32px;
      line-height: 32px;
      background: #fff;
      padding: 3px 8px;
      color: #92908d;
      border-bottom: 1px solid #ddd;
      cursor: pointer;
  }
  .t_toolgroup .t_tool:hover {
      color: #15afce;
      border-color: #15afce;
  }
/**/

// variables
@import "color";

//
@import "forms";

// 
@import "alert";

@import "menu";
